<template>
	<view class="content">
			<u-navbar
					title="我的钱包"
					:autoBack="true"
					:titleStyle="{color: '#FFF'}"
					bgColor="transparent"
					leftIconColor='#fff'
					:placeholder="true" 
				>
			</u-navbar>
		<view class="money">
			<view class="moneymini"><text>￥</text>
			<u-count-to :startVal="100.00" :endVal="0.00" :decimals="2" color="#fff" fontSize='76rpx'></u-count-to>
			</view>
			<view>我的余额</view>
		</view>
		<view class="footer">
		<p>充值记录</p>
		<scroll-view class="record" scroll-y="true" v-if="moneylist.length !== 0">
			<view class="expenses" v-for="(item,index) in moneylist" :key='index'>
				<view class="left">
					<text>支付费用</text>
					<view class="time">
						<text>2023-07-10</text>
						<text>14:30</text>
					</view>
				</view>
				<view class="rigth">
					<text>-68.90</text>
				</view>
			</view>
		</scroll-view>
		<view class="kongkong" v-else>
			<image src="https://xixijj.oss-cn-chengdu.aliyuncs.com/attach/2023/09/09939202309221614473447.png" mode="widthFix"></image>
			<view>暂无充值记录~</view>
		</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				moneylist:[]
			}
		},
		methods:{
			
		}
	}
</script>

<style lang="scss">
	page{
		background: linear-gradient(180deg, #00A537 0%, #F2FAF5 100%);
	}
	.money{
		margin-top: 140rpx;
		color: white;
		text-align: center;
		font-size: 30rpx;
		margin-bottom: 80rpx;
		.moneymini{
			font-size: 36rpx;
			margin-bottom: 20rpx;
		}
	}
	.footer{
		margin-left: 40rpx;
		p{
			font-size: 30rpx;
			color:#fff;
			margin-bottom: 26rpx;
		}
		.record{
			box-sizing: border-box;
			width: 670rpx;
			height: 580rpx;
			border-radius: 20rpx;
			background-color: #fff;
			padding: 40rpx 40rpx 20rpx 30rpx;
			.expenses{
				display: flex;
				align-items: center;
				justify-content: space-between;
				border-bottom: 1px solid #f2f2f2;
				.left{
					font-size: 28rpx;
					.time{
						margin: 10rpx 0;
						
						text{
							font-size: 20rpx;
							color: #999999;
							margin-right: 24rpx;
						}
					}
				}
				.rigth{
					font-size: 28rpx;
					color: #CC0022;
				}
			}
		}
		.kongkong{
			text-align: center;
		}
	}
</style>